<template>
	<div class="uploadimg">
		<m-upload @click="uploadimg">
			<btn v-if='!img' type="primary">立即上传</btn>
			<div v-if='img' class="imgbox" :style="{backgroundImage:'url('+img+')'}">
			</div>
		</m-upload>
	</div>
</template>

<script type="text/ecmascript-6">
	import { uploadImg } from 'api'
	import MUpload from './upload'
	import Btn from 'C/btn'
	export default {
		props: ['src'],
		components: {
			MUpload,
			Btn
		},
		data() {
			return {
				img: this.src || ''
			}
		},
		mounted() {},
		methods: {
			uploadimg(e) {
				var data = new FormData();
				data.append('file', e)
				data.append('name', 'n')
				uploadImg(data).then(res => {
					this.img = res.data.data
					this.$emit('change', res.data.data)
				})
			}
		},
		computed: {}
	}
</script>

<style lang="scss" scoped>
	.uploadimg {
		display: inline-block;
		.imgbox {
			display: inline-block;
			position: relative;
			display: inline-block;
			margin-right: 10px;
			width: 50px;
			height: 50px;
			background-position: center center;
			background-size: contain;
			background-repeat: no-repeat;
			cursor: pointer;
			img {
				width: 100%;
				height: 100%;
			}
		}
	}
</style>